<?php // no direct access
	defined('_JEXEC') or die('Restricted access');
	jimport('mylibs.globalModel');
	$globalModel = new globalModel(); 
	$data = $globalModel->getArticleByCatId(1);	
?>
<div id="main-container" class="has-leftright">
            <div class="innerfront clearfix">
                
                <div id="content-top">
                    <div class="innerfront clearfix">
						<script type="text/javascript" src="<?php echo $this->template_dir;?>js/jquery.carousel.min.js"></script>
                        <script type="text/javascript" src="<?php echo $this->template_dir;?>js/jquery.mousewheel.min.js"></script>
                        
                        <script type="text/javascript">
                        
                            var carousel;
                            
                            $(document).ready(function(){
                                carousel = $('#carousel').carousel({width: 870, height: 350, itemWidth:120, horizontalRadius:270, verticalRadius:85, resize:false, scaleRatio:0.2, autoScroll:true, itemSelect:onItemSelect});
                            });

                            function nextItem() {
                                carousel.scrollToNext();
                            }
                            
                            function previousItem() {
                                carousel.scrollToPrevious();
                            }
                            
                            // populate the text fields when an item is selected
                            function onItemSelect(event) {
                                $('#text #selected-title').html(event.data.title);
                                $('#text #selected-description').html(event.data.description);
                            }
                            
                        </script>
                    	<div id="slideshow">
                            <div id="carousel-container">
                                <ul id="carousel">
                                <?php 
                                foreach ( $data as $key=>$value ){
									if($value['article_image']!="")
									{
                                ?>
										<li>                                      
											<img src='<?php echo JURI::root(false)?>auto_thumbnail/timthumb.php?src=<?php echo $value['article_image'];?>&h=224&w=327&zc=1' alt="" />
											<p class="title"><?php print $value['title']?></p>
											<p class="description">
												<span><?php print $globalModel->getShortText($value['introtext'],435);?></span>
												<a href="index.php?option=com_content&id=<?php print $value['id'];?>&view=article&layout=services" class="more-info">More info</a>
											</p>
										</li> 
                                <?php
									}
                                } 
                                ?>                                   
                                </ul>
                            </div>
                            <div id="text">
                                <p id="selected-title"></p>
                                <p id="selected-description"></p>
                            </div>
                            <div id="controls">
                                <a id="left" title="Forrige" onclick="previousItem()"></a>
                                <a id="right" title="Næste" onclick="nextItem()"></a>
                            </div>
               			</div><!--slideshow-->
                    </div>
                </div><!--content-top-->
                
            </div>    	        
</div>

